<template>
    <div class="push-list-item">
        <a 
        class="title" 
        :href="aHref" 
        target="_blank"
        >
            {{data.docname}}
        </a>

        <div class="tool-bar">
            <item-tool-bar
                layout="views,download,collect"
                :data="data"
                type="document"
                :share="aHref"
                :rowguid="data.guid"
            ></item-tool-bar>
        </div>
    </div>
</template>

<script>
import itemToolBar from '@components/sys/item-tool-bar/index';

export default {
    components: {
        itemToolBar,
    },
    props: {
        data: {
            type: Object,
            default: () => ({}),
        },
    },
    computed: {
        aHref() {
            return `/document/${this.data.guid}`
        },
    },
};
</script>

<style lang="scss" scoped>
    @import '@css/var.scss';

    .push-list-item {
        & + .push-list-item{
            margin-top: 24px;
        }

        .title {
            display: block;
            color: #333;
            line-height: 1em;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;

            &:hover{
                color: $primaryColor;
            }
        }
    }
</style>